<template>
    <div>
        <ul>
            <li v-for="(item, index) in list" :key="index">
                <img :src="item.image" alt="">
                {{ item.id }}.{{ item.author }}
            </li>
        </ul>

        <TestThaiwind />
    </div>
</template>

<script setup lang="ts">
import { ref, onMounted, computed } from 'vue'
import useDemoStore from '../../stores/demo'
import TestThaiwind from '@/components/TestThaiwind.vue'

import api from '../../api/api'
import { ListType } from '../../types'
const demoStore = useDemoStore()
const list: ListType | any = computed<ListType>(() => {
    return demoStore.state.list
})
onMounted(() => {
    console.log('mouted')

    api.getList().then(res => {
        demoStore.setList(res.data.list)
    })

})
</script>